<template>
  <div>
    <div class="cpn">
      <h2 class='title'>{{message}}</h2>
      <button @click="btnClick">按钮</button>
      <h2>{{name}}</h2>
      <img src="src/img/small.jpg" alt="">
    </div>
    <!-- 使用Cpn组件 -->
    <Cpn/>
  </div>
</template>


<script>
import Cpn from "./Cpn.vue";
export default {
  name: "App",
  data() {
    return {
      message: "hello webpack",
      name: "热更新配置成功",
      count:0,
    };
  },
  methods: {
    btnClick() {
      console.log(this.count++)
    }
  },
  components: {
    Cpn//注册Cpn组件
  }
}
</script>

<style scoped>
.title {
  color: #42b983;
}
.cpn {
  border: #42b983 solid 2px;
}
</style>